// import dom from './lib/dom.js';
import { UIPanel, UIRow, UIHorizontalRule } from './lib/ui.js';

function MenubarFile(editor) {

    const strings = editor.strings

    var container = new UIPanel();
    container.setClass('menu');

    // 文件
    var title = new UIPanel();
    title.setClass('title');
    title.setTextContent(strings.getKey('menubar/file'));
    container.add(title);

    // Group
    var options = new UIPanel();
    options.setClass('options');
    container.add(options);


    var option = new UIRow();
    option.setClass('option');
    option.setTextContent(strings.getKey('menubar/file/new'));
    options.add(option)
    console.log(option);
    option.onClick(function (e) {
        editor.layers.clear()
    })


    // 导入
    var option = new UIRow();
    option.setClass('option');
    option.setTextContent(strings.getKey('menubar/file/import'));
    options.add(option)
    option.onClick(Import);


    var fileInput = document.createElement('input');
    fileInput.type = 'file';
    fileInput.addEventListener('change', function (event) {

        var reader = new FileReader();
        reader.addEventListener('load', function (event) {

            editor.clear();
            console.log(event.target.result);
            // editor.fromJSON(JSON.parse(event.target.result));

        }, false);

        reader.readAsText(fileInput.files[0]);

    });

    function Import() {

        if (confirm('任何未保存的数据将丢失。你确定吗?'))
            fileInput.click();

    }

    var hr = new UIHorizontalRule();
    options.add(hr);

    // 发布
    var option = new UIRow();
    option.setClass('option');
    option.setTextContent(strings.getKey('menubar/file/publish'));
    options.add(option)
    option.onClick(function () {
        editor.publish();
    })
    return container;

}

export { MenubarFile };
